<template>
  <div>
    <h1 :is="show"></h1>
    <el-table :data="tableData" style="width: 100%">
    <el-table-column prop="unid" label="unid" width="180"> </el-table-column>
    <el-table-column prop="username" label="username" width="180"> </el-table-column>
    <el-table-column prop="nickname" label="nickname"> </el-table-column>
    <el-table-column prop="vipLevel" label="VIPlevel"> </el-table-column>
    <el-table-column prop="operate" label="operate">
      <template v-slot="{row}">
        <el-row>
        <el-button type="primary" icon="el-icon-edit" circle @click="xiugai(row)"></el-button>
        <el-button type="danger" icon="el-icon-delete" circle></el-button>
      </el-row>
      </template>
    </el-table-column>
  </el-table>
  </div>
</template>
<script>
import * as api from "../../api"
import updataFrom from '../updataform'
import {mapMutations,mapState} from "vuex"
export default {
  data() {
    return {
      tableData: [],
    };
  },
  computed:{
    ...mapState(["show"])
  },
  mounted() {
    api.getAllUsers()
    .then(res=>{
      // console.log(res.data.data);
      this.tableData=res.data.data
    })
  },
  components:{
    updataFrom
  },
  methods:{
    ...mapMutations(["SET_UPDATAUSERS","SET_UPDATADATA"]),
    xiugai(row){
      console.log(row);
      this.SET_UPDATADATA(row)
      this.SET_UPDATAUSERS("updataFrom")
    }
  }
};
</script>
<style scoped lang="less">
  .usermanage{
    position: relative;
  }
</style>